<!-- 
选择省市区 
 -->
<template>
	<view>
		<page-head :title="id !='' ? '修改收货地址': '添加收货地址'" :headtype="2"></page-head>
		<view class="blockbg marginAuto">
			<view class="contact">
				<view class="contacttitle">收货人</view>
				<view class="contactblock" style="width:75%;">
					<input type="text" v-model="name"  placeholder="姓名" />
				</view>
			</view>
			<view class="contact">
				<view class="contacttitle">手机号码</view>
				<view class="contactblock" style="width:75%;">
					<input type="number" v-model="phone"  placeholder="手机号" />
				</view>
			</view>
			<view class="contact">
				<view class="contacttitle">所在地址</view>
				<pick-regions style="width: 75%;" :defaultRegion="defaultRegion" @getRegion="handleGetRegion">
					<view class="contactblock" style="width:100%;justify-content:space-between;">
						<view class="contactblock" style="width: 100%;display:flex;justify-content:space-between;color:#999999;" v-if="regionName == ''">
							<view style="font-size:30rpx;">省、市、区、街道</view>
							<u-icon name="arrow-right" color="#333" size="34"></u-icon>
						</view>
						<view class="contactblock" style="color:#333;" v-else>{{regionName}}</view>
					</view>
				</pick-regions>
			</view>
			<view class="contact">
				<view class="contacttitle">详细地址</view>
				<view class="contactblock" style="width:75%;">
					<input type="text" v-model="sitedec"  placeholder="小区名称、楼栋/乡村名称" />
				</view>
			</view>
		</view>
		<view class="blockbg marginAuto">
			<view class="contact" style="justify-content: space-between;border:none;">
				<view class="contacttitle" style="width: 250rpx;line-height:40rpx;">设置默认收货地址</view>
				<view class="contactblock">
					<u-switch v-model="isdefa" @change="sizedefafun" size="40" activeColor="#9E190F" inactiveColor="#D3D3D3"></u-switch>
				</view>
			</view>
		</view>
		<view class="addsite-btn">
			<u-button @click="enter" class="addsite-btn" color="#9E190F" text="保存"
			:customStyle="{
				border:'none',
				borderRadius:'10rpx',
				}"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:'',
				name:'',
				phone:'',
				sitedec:'',
				isdefa:true,
				defaultRegion: [], // ['河南省', '郑州市', '中原区']
				defaultRegionCode: '', // 410102
				regionName: '',
			}
		},
		onLoad(option) {
			this.id = option.id;
			if(this.id != ''){
				this.initData()
			}
		},
		methods: {
			enter(){
				let sendData = {
					id:this.id,
					username:this.name,
					mobile:this.phone,
					address:this.regionName,
					house:this.sitedec,
					is_default:this.isdefa ? 1 : 0  // 1,0
				};
				if(this.name == '' || this.phone == '' || this.regionName == '' || this.sitedec == ''){
					this.apifun.toast('请将信息补充完整');
					return false
				};
				if (this.apifun.testphone.test(this.phone) == false) {
					this.apifun.toast("手机格式有误");
					return false
				};
				this.apifun.unirequest('/api/address/setUserAddress','post',sendData,(res)=>{
					// console.log(res)
					if(res.code === 200){
						let datas = res.data;
						this.apifun.toast('添加成功');
						setTimeout(()=>{
							this.apifun.goback();
						},1500)
					}else{
						this.apifun.toast(res.msg)
					}
				})
			},
			initData(){
				let sendData = {
					id:this.id
				};
				this.apifun.unirequest('/api/address/getUserAddress','post',sendData,(res)=>{
					// console.log(res)
					if(res.code === 200){
						let datas = res.data;
						this.name = datas.username;
						this.phone = datas.mobile;
						this.regionName = datas.address;
						this.sitedec = datas.house;
						this.isdefa = datas.is_default == 1 ? true:false;
					}else{
						this.apifun.toast(res.msg)
					}
				})
			},
			sizedefafun(e){  // 选择默认地址
				this.isdefa = e;
			},
			handleGetRegion(region) {
				this.region = region;
				this.regionName = region[0].name + '-' + region[1].name + '-' + region[2].name;
				this.defaultRegionCode =  region[2].code;
			},
		},
		onPullDownRefresh() {
			uni.stopPullDownRefresh();
		},
	}
</script>

<style scoped lang="scss">
	.blockbg {
		width: 640rpx;
		border-radius: 20rpx;
		background-color: #fff;
		padding: 24rpx;
		margin-top: 20rpx;
	}
	.contact {
		width: 100%;
		display: flex;
		border-bottom: 1px solid #F7F7F7;
	
		.contacttitle {
			width: 150rpx;
			color: #333333;
			font-size: 28rpx;
			line-height: 88rpx;
		}
	
		.contactblock {
			display: flex;
			line-height: 88rpx;
			input{
				width:100%;height:88rpx;
				line-height:88rpx;
				text-align:left;
				font-size:28rpx;
				color:#333;
			}
		}
	}
	.addsite-btn{
		position:fixed;
		bottom:100rpx;
		width: 90%;
		height:88rpx;
		padding: 0rpx 5%;
		background-color:#F4F5F6;
		color: #fff;
		font-size: 30rpx;
	}
</style>